<!-- src/views/Login.vue -->
<template>
  <div class="container mx-auto p-4">
    <h1 class="text-2xl font-bold mb-4">用户登录</h1>
    <form @submit.prevent="handleLogin">
      <div class="mb-4">
        <label class="block mb-2">用户名</label>
        <input v-model="username" type="text" class="w-full p-2 border border-gray-300 rounded" />
      </div>
      <div class="mb-4">
        <label class="block mb-2">密码</label>
        <input v-model="password" type="password" class="w-full p-2 border border-gray-300 rounded" />
      </div>
      <button type="submit" class="bg-blue-500 text-white px-4 py-2 rounded">登录</button>
    </form>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import { useRouter } from 'vue-router'

const router = useRouter()
const username = ref('')
const password = ref('')

const handleLogin = () => {
  // 模拟登录逻辑
  localStorage.setItem('user', JSON.stringify({ username: username.value }))
  router.push('/')
}
</script>